{include file="Public:header" /}
		<!--菜单start-->
{include file="Public:nav" /}
		<!--菜单end-->
		<div class="content">
			<!--分类start-->

			<div class="buttons-tab screen mechanism-tab clearfix" style="margin-top:10px;" id="mechanism-tab">
				{volist name="categoryList" id="v"}
					<a href="#tab{$i}" style="display:inline-block;width: 4.5rem;" class="tab-link button"><img src="{$v['ico_img']}" >{$v['name']}</a>
				{/volist}
				
				<!--<span class="tab-link button active">爱国主义教育2</span>style="margin-top:10px;"-->
			</div>

			<!--修改-->

			<!--分类end-->

			<!--基地start-->
			<div class="tabs">
				<div class="in_hot_box activity_1 tab hotel_list active" id="tab1">
					{volist name="base1" id="base1"}
					<div class="card demo-card-header-pic">
						<a href="{:U('Serve/base_detail',array('base_id'=>$base1['id']))}">
						<div valign="bottom" class="card-header color-white no-border no-padding">
							<img class='card-cover' src="{$base1['smallimage']}" alt="">
						</div>
						<div class="card-content">
							<div class="card-content-inner">
								<p class="hot_list_title">{$base1['base_name']}</p>
								<p class="service color-gray" style="width: 210px;"><i class="iconfont icon-map"></i>{$base1['address']}</p>
								<p class="color-gray">
									<span><i class="iconfont icon-phone"></i>{$base1['mobile']}</span>
									<span style="position: absolute;top: initial;right: 0;" class="price">{$base1['money']}起</span>
								</p>
							</div>
						</div>
						</a>
					</div>
					{/volist}
					<!--<div class="card demo-card-header-pic">
						<a href="hotel.html">
						<div valign="bottom" class="card-header color-white no-border no-padding">
							<img class='card-cover' src="__PUBLIC__/Home/activity/img/raw_1499911304.jpeg" alt="">
						</div>
						<div class="card-content">
							<div class="card-content-inner">
								<p class="hot_list_title">广州XX基地</p>
								<p class="service color-gray">如果你无法简洁的表达你的想法，那只说明你还不够了解它。</p>
								<p class="color-gray"><span><i class="iconfont icon-map"></i>天河</span><span><i class="iconfont icon-phone"></i>020-38686868</span><span class="price">328起</span></p>
							</div>
						</div>
						</a>
					</div>
					<div class="card demo-card-header-pic">
						<a href="hotel.html">
						<div valign="bottom" class="card-header color-white no-border no-padding">
							<img class='card-cover' src="__PUBLIC__/Home/activity/img/raw_1499911304.jpeg" alt="">
						</div>
						<div class="card-content">
							<div class="card-content-inner">
								<p class="hot_list_title">广州XX基地</p>
								<p class="service color-gray">如果你无法简洁的表达你的想法，那只说明你还不够了解它。</p>
								<p class="color-gray"><span><i class="iconfont icon-map"></i>天河</span><span><i class="iconfont icon-phone"></i>020-38686868</span><span class="price">328起</span></p>
							</div>
						</div>
						</a>
					</div>-->
				</div>


				<div class="in_hot_box activity_1 tab hotel_list" id="tab2">
					{volist name="base2" id="base2"}
					<div class="card demo-card-header-pic">
						<a href="{:U('Serve/base_detail',array('base_id'=>$base2['id']))}">
							<div valign="bottom" class="card-header color-white no-border no-padding">
								<img class='card-cover' src="{$base2['smallimage']}" alt="">
							</div>
							<div class="card-content">
								<div class="card-content-inner">
									<p class="hot_list_title">{$base2['base_name']}</p>
									<p class="service color-gray" style="width: 210px;"><i class="iconfont icon-map"></i>{$base2['address']}</p>
									<p class="color-gray">
										<span><i class="iconfont icon-phone"></i>{$base2['mobile']}</span>
										<span style="position: absolute;top: initial;right: 0;" class="price">{$base2['money']}起</span>
									</p>
								</div>
							</div>
						</a>
					</div>
					{/volist}
				</div>  


				<div class="in_hot_box activity_1 tab hotel_list" id="tab3">
					{volist name="base3" id="base3"}
					<div class="card demo-card-header-pic">
						<a href="{:U('Serve/base_detail',array('base_id'=>$base3['id']))}">
							<div valign="bottom" class="card-header color-white no-border no-padding">
								<img class='card-cover' src="{$base3['smallimage']}" alt="">
							</div>
							<div class="card-content">
								<div class="card-content-inner">
									<p class="hot_list_title">{$base3['base_name']}</p>
									<p class="service color-gray" style="width: 210px;"><i class="iconfont icon-map"></i>{$base3['address']}</p>
									<p class="color-gray">
										<span><i class="iconfont icon-phone"></i>{$base3['mobile']}</span>
										<span style="position: absolute;top: initial;right: 0;" class="price">{$base3['money']}起</span>
									</p>
								</div>
							</div>
						</a>
					</div>
					{/volist}
				</div>


				<div class="in_hot_box activity_1 tab hotel_list" id="tab4">
					{volist name="base4" id="base4"}
					<div class="card demo-card-header-pic">
						<a href="{:U('Serve/base_detail',array('base_id'=>$base4['id']))}">
							<div valign="bottom" class="card-header color-white no-border no-padding">
								<img class='card-cover' src="{$base4['smallimage']}" alt="">
							</div>
							<div class="card-content">
								<div class="card-content-inner">
									<p class="hot_list_title">{$base4['base_name']}</p>
									<p class="service color-gray" style="width: 210px;"><i class="iconfont icon-map"></i>{$base4['address']}</p>
									<p class="color-gray">
										<span><i class="iconfont icon-phone"></i>{$base4['mobile']}</span>
										<span style="position: absolute;top: initial;right: 0;" class="price">{$base4['money']}起</span>
									</p>
								</div>
							</div>
						</a>
					</div>
					{/volist}
				</div>
			</div>
			<!--基地start-->
		</div>

		<script type="text/javascript" src="http://g.alicdn.com/sj/lib/jquery/dist/jquery.min.js"></script>
		<script type='text/javascript' src='http://g.alicdn.com/sj/lib/zepto/zepto.min.js' charset='utf-8'></script>
		<script type='text/javascript' src='http://g.alicdn.com/msui/sm/0.6.2/js/sm.min.js' charset='utf-8'></script>

		<!--城市选择结束-->

		<script src="http://idangero.us/swiper/dist/js/swiper.min.js"></script>
		<script type="text/javascript" src="__PUBLIC__/Home/activity/js/huodon.js" ></script>
		<script>
			var swiper = new Swiper('.swiper-container', {
				pagination: '.swiper-pagination',
				paginationClickable: true
			});
			window.onload=function(){
			var oTab=document.getElementById("mechanism-tab")
			var oTabLi=oTab.getElementsByTagName("a");
			var Width=oTabLi.length*5+"rem";
			oTab.style.width=Width
		}
		</script>
	</body>
</html>

<script>
	$(document).ready(function () {
        $("#mechanism-tab").find('a').eq(0).addClass('active');
    })
</script>